<template>
 <div class="container">
  <div class="box">
    <div class="header">
111
    </div>
    <div class="main">555</div>
  </div>
  <div class="footer">555</div>
 </div>
</template>

<style lang="scss">
*{
  padding: 0;
  margin: 0;
  list-style: none;
}
html,body,#app,.contaioner{
  width: 100%;
  height: 100%;
}
.container{
  display: flex;
  flex-direction: column;
  .box{
    flex: 1;
    overflow: auto;
    .header{
      height: 50px;
      background: paleturquoise;
    }
    .main{
     flex: 1;
      overflow: auto;
      background: darkcyan;
    }
  }
  .footer{
    background: hotpink;
height: 3.125rem;
  }
}
</style>
